<template>
  <div>
    <h1 ref="title">Example Page 11</h1>
  </div>
</template>

<script setup>
import { ref,onMounted, useTemplateRef } from 'vue'
const title = ref(null); /* dom里ref后的字符串的名字要和变量的名字一样*/
const h1 = useTemplateRef('title');
onMounted(() => {
  console.log("拿到dom对象")
  console.log(title.value)
  // 第二种拿去 
  console.log('第二种拿')
  console.log(h1.value)
  console.log(title.value === h1.value)
})

</script>

<style scoped>
.controller {
  width: 80%;
  margin: 1em auto;
}

</style>